<template>
<p>用于布局的容器组件，方便快速搭建页面的基本结构：</p>
<p><code>&lt;el-container&gt;</code>：外层容器。 当子元素中包含 <code>&lt;el-header&gt;</code> 或 <code>&lt;el-footer&gt;</code> 时，全部子元素会垂直上下排列， 否则会水平左右排列。</p>
<p><code>&lt;el-header&gt;</code>：顶栏容器。</p>
<p><code>&lt;el-aside&gt;</code>：侧边栏容器。</p>
<p><code>&lt;el-main&gt;</code>：主要区域容器。</p>
<p><code>&lt;el-footer&gt;</code>：底栏容器。</p>
<div class="tip custom-block"><p class="custom-block-title">TIP</p><p>以上组件采用了 flex 布局，使用前请确定目标浏览器是否兼容。 此外， <code>&lt;el-container&gt;</code>的直接子元素必须是后四个组件中的一个或多个。 后四个组件的父元素必须是一个 <code>&lt;el-container&gt;</code></p></div>
</template>
<style scoped>
@import '../../assets/elementPlusDemo.css'
</style>